<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>滚动</title>
  <style type="text/css">
*{margin:0;padding:0;list-style:none;}
#gd{border:solid 2px #f00;padding:10px;height:100px;overflow: hidden;width:40%;margin:100px auto;}
#gd li{height: 2.3em;line-height: 2.3;}
.jggd{border:solid 2px #f00;width:40%;margin:100px auto;}
#jggd{height:90px;overflow: hidden;margin:10px;}
#jggd ul{ overflow: hidden;}
#jggd li{height:30px;line-height: 30px;}
  </style>
<!-- <script type="text/javascript" src="jquery-1.11.3.min.js"></script>-->
</head>
<body>
<div id="gd">
	<ul id="gd1">
		<li>1111111111111111</li>
		<li>2222222222222222</li>
		<li>3333333333333333</li>
		<li>4444444444444444</li>
		<li>5555555555555556</li>
	</ul>
</div>
<div class="jggd">
<div id="jggd">
	<ul>
		<li>1111111111111111</li>
		<li>2222222222222222</li>
		<li>3333333333333333</li>
		<li>4444444444444444</li>
	</ul>
</div>
</div>
<script type="text/javascript">

//间隔滚动

var jggd = document.getElementById('jggd');
var lih=30;
jggd.innerHTML += jggd.innerHTML;
jggd.scrollTop = 0;
var myjggd;
var speed = 50,
	delay = 2000;
function sUp(){
	jggd.scrollTop++;
	myjggd = setInterval('jgUp()',speed);
}
function jgUp(){
		if (jggd.scrollTop % lih == 0) {
			/*clearInterval(myjggd);*/
			setTimeout("sUp()",delay);
		} else{
			jggd.scrollTop++;
			if (jggd.scrollTop>=jggd.scrollHeight) {
				jggd.scrollTop = 0;
		 	}
		};
	}

setTimeout("sUp()",delay);//初始化




//无缝滚动

 	var gdBox = document.getElementById('gd'),
 	    gd1= document.getElementById('gd1');
		var gd2 = document.createElement("ul");
		gd2.innerHTML = gd1.innerHTML;
		gdBox.appendChild(gd2);
 	function scrollUp(){
	 	if (gdBox.scrollTop>=gd1.offsetHeight) {
			gdBox.scrollTop = 0;
	 	}else{
	 		gdBox.scrollTop++;
	 	};
	 	}
 	var time = 50;
 	var myScroll= setInterval('scrollUp()',time);
 	gdBox.onmouseover = function (){
 		clearInterval(myScroll);
 	}
 	gdBox.onmouseout = function(){
 		myScroll= setInterval('scrollUp()',time);
 	}

 </script>
</body>
</html>
